<template>
	<view>
		<uni-byt-top-com title="多文件上传" :backShow="backShow"></uni-byt-top-com>
		<scroll-view scroll-y="true" :style="{height:scrollHeight+'px'}">
			<view class="flex-col">

				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">默认上传(双向绑定url)：</text>
						<text class="text-size-16 text-min-color">:urlList.sync="urlList"</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>


				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">自定义行内样式：</text>
						<text class="text-size-16 text-min-color">styleName="background-color:black"</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList styleName="background-color:black" :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>

				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">自定义类名样式：</text>
						<text class="text-size-16 text-min-color">className="w-200"</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList className="w-200" :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>

				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">上传文件类型（video）：</text>
						<text class="text-size-16 text-min-color">uploadType="video"</text>
						<text class="text-size-16 text-min-color">默认：images:图片</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList uploadType="video" :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>


				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">上传文字描述：</text>
						<text class="text-size-16 text-min-color">name="上传文字描述"</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList className="wh-100" name="上传文字描述" :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>

				<view class="flex-col mt-14">
					<view class="flex-col my-14  mx-15">
						<text class="text-size-16">最大上传数量：</text>
						<text class="text-size-16 text-min-color">:maxCount="8"</text>
						<text class="text-size-16 text-min-color">默认为5</text>
					</view>
					<view class="px-15">
						<uni-byt-upload-imgList className="wh-100" :maxCount="8" name="上传文字描述" :urlList.sync="urlList"
							@change="flieListChange"></uni-byt-upload-imgList>
					</view>
				</view>

			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		getHeight
	} from "@/util"
	export default {
		data() {
			return {
				scrollHeight: getHeight(),
				backShow: false,
				urlList: []
			}
		},
		onLoad(play) {
			if (play.backShow) {
				if (play.backShow == '1') {
					this.backShow = true
				}
			}
		},
		methods: {
			flieListChange(data) {
				console.log("多图上传数组：", data, this.urlList);
			}
		}
	}
</script>

<style scoped>
</style>